<template>
	<view class="container">
		<view class="s-searchbox">
			<view class="s-search-input">
				<icon type="search" :size='13' color='#333'></icon>
				<input confirm-type="search" placeholder="请输入昵称" :focus="true" auto-focus placeholder-class="s-input-plholder"
				 class="s-input" v-model.trim="key" @input="inputKey"/>
				<icon type="clear" :size='13' color='#bcbcbc' @tap="cleanKey" v-show="key"></icon>
			</view>
			<view class="s-cancle" @tap="back">取消</view>
		</view>
		<s-list-view title="消息列表">
			<s-list-cell :lineLeft="false" @click="detail">
				<view class="s-item-box">
					<view class="s-msg-box">
						<image src="../../static/images/user/user.jpg" class="s-msg-pic" mode="widthFix"></image>
						<view class="s-msg-item">
							<view class="s-msg-name">呼噜猪</view>
							<view class="s-msg-content">上线打游戏了！</view>
						</view> 
					</view>
					<view class="s-msg-right">
						<view class="s-msg-time">10:22</view>
						<s-badge type="danger" class="s-badge">9</s-badge>
					</view>
				</view>
			</s-list-cell>
		</s-list-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				key:''
			};
		},
		methods:{
			detail(){
				uni.navigateTo({url: '../chat/chat'})
			},
			inputKey(e){
				
			},
			back(e){
				
			},
			cleanKey(){
				this.key = ''
			}
		}
	}
</script>

<style lang="scss" scoped>
@import "msg.scss";
</style>
